<template>
  <div class="form-element">
    <div class="col-md-12 padding-0">
      <div class="col-md-12" style="height:600px">

        <div class="panel form-element-padding">
          <div class="panel-heading">
            <h3>资料设置</h3>
          </div>
        </div>

        <div class="out">

          <div style="display: block;">
            <div class="ydc-reg-form-group clearfix">
              <div class="ydc-reg-form-input">
                <label></label>







              </div>
            </div>


            <el-row v-if="passenger.nickName!=null">
              <el-col :span="8"><h3>昵称</h3></el-col>
              <el-col :span="12"><h3>{{ passenger.nickName }}</h3></el-col>
            </el-row>

            <el-row>
              <el-col :span="8">
                <h3>姓名</h3>
              </el-col>
              <el-col :span="12">
                <h3>{{ passenger.passengerName }}</h3>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="8">
                <h3>所在城市</h3>
              </el-col>
              <el-col :span="12">
                <h3>{{ passenger.city }}</h3>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="8">
                <h3>身份证号</h3>
              </el-col>
              <el-col :span="12">
                <h3>{{ passenger.cardId }}</h3>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="8">
                <h3>手机</h3>
              </el-col>
              <el-col :span="12">
                <h3>{{ passenger.phone }}</h3>
              </el-col>
            </el-row>


            <el-row>
              <el-col :span="8">
                <h3>邮箱</h3>
              </el-col>
              <el-col :span="12">
                <h3>{{ passenger.email }}</h3>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <h3>QQ/微信</h3>
              </el-col>
              <el-col :span="12">
                <h3>{{ passenger.wechat }}</h3>
              </el-col>
            </el-row>

            <el-row>

              <el-col :span="12">
                <el-button type="danger" @click="toEditInfo">修改</el-button>
              </el-col>
            </el-row>


          </div>

        </div>
      </div>
      <div class="info_box">
        <img class="info" src="../../assets/info.jpg" alt="">

      </div>
    </div>
    <!-- right end -->
  </div>
</template>

<script>
export default {
  name: "MyDetail",
  data() {
    return {
      passenger: {
        nickName: '123213',
      },
    }
  },
  created() {
    const _this = this
    this.passenger = JSON.parse(sessionStorage.getItem('passenger'))

  },
  methods: {
    toEditInfo() {
      this.$router.replace('/passenger/editInfo')
    },
    getFiles: function(event) {
      var files = event.target.files;
      for (var i = 0; i < files.length; i++) {
        ths.files.push(files[i]);
      }
    },
    upload: function() {
      let formData = new FormData();
      for (let i = 0; i < this.files.length; i++) {
        formData.append('files', this.files[i]);
      }
      this.$axios.post("/upload", formData, {
        headers: {
          'Content-Type': 'multipart/form-data'
        }
      }).then(function(response) {
        // 请求成功
      }, function(err) {

      })
    }

  }
}
</script>

<style scoped>

/**{*/
/*  outline: solid #f00 1px !important;*/
/*  background: #000 !important;*/
/*  color: #fff !important;*/
/*}*/
.out {

  width: 900px;
  height: 450px;
  background-color: whitesmoke;
  border-radius: 5px;
  position: absolute;
  top: 30%;
  left: 23%;
  margin-top: -100px;
  margin-left: -200px;
  padding-left: 50px;
}

.info_box {
  position: absolute;
  width: 800px;
  height: 450px;
  top: 13%;
  left: 60%;
  float: right;
}

.info {
  width: 650px;
  height: 450px;
  top: 0%;
  left: 50%;
}

</style>
